<template>
  <div>
    <el-container>
      <el-header class="nav1">
        <!--  整个页面的下半部分  是一个容器  -->
        <div class="nav1" :class="navBarFixed == true ? 'navBarWrap' :''">吸顶导航</div>
      </el-header>


      <template>
        <span  @click="sentMesg">详情</span>
      </template>


    </el-container>
  </div>
</template>


<script>

// import {marked} from 'marked';

export default {
  data() {
    return {
      navBarFixed: false,
    };
  },

  components: {},

  mounted() {
    window.addEventListener("scroll", this.watchScroll);
  },

  methods: {
    errorHandler() {
      return true
    },
    watchScroll() {
      let scrollTop =
          window.pageYOffset ||
          document.documentElement.scrollTop ||
          document.body.scrollTop;
      console.log(scrollTop)
      //  当滚动超过 90 时，实现吸顶效果
      if (scrollTop > 100) {
        this.navBarFixed = true;
      } else {
        this.navBarFixed = false;
      }
    },
    sentMesg(){
      this.$router.push({
        path:'/a',
        query: {
          id: 21
        }
      })
    },
  }
}
</script>


<style>

.scroll{
  height:2000px;
}
.nav1{
  padding:15px;
  width:100%;
  box-sizing: border-box;
  text-align: center;
}
.navBarWrap {
  position:fixed;
  z-index:999;
}

</style>

